let m = parseInt(prompt('请输入队伍数量：'))
if (!(m > 0)) {
	alert('队伍数量不合法，请重新输入！')
	location.reload()
} else {
	let n = parseInt(prompt('请输入小球数量：'))
	if (!(n > 0)) {
		alert('小球数量不合法，请重新输入！')
		location.reload()
	} else {
		// m and n are valid

		let teamTableBody = document.getElementById('teamTableBody')
		let colorTableBody = document.getElementById('colorTableBody')
		let configCodeElement = document.getElementById('configCode')

		let teams = new Array(m)
		let colors = new Array(n)
		let config = { teams: teams, colors: colors }
		function updateConfig() {
			configCodeElement.value = JSON.stringify(config)
		}

		for (let i = 0; i < m; ++i) {
			let team = { name: '', id: '' }
			teams[i] = team

			let teamTableRow = document.createElement('tr')

			let teamNumberElement = document.createElement('td')
			teamNumberElement.innerText = i
			teamTableRow.appendChild(teamNumberElement)

			let teamNameElement = document.createElement('td')
			let teamNameInput = document.createElement('input')
			teamNameInput.type = 'text'
			teamNameInput.addEventListener('keyup', function () {
				team.name = teamNameInput.value
				updateConfig()
			})
			teamNameElement.appendChild(teamNameInput)
			teamTableRow.appendChild(teamNameElement)

			let teamIdElement = document.createElement('td')
			let teamIdInput = document.createElement('input')
			teamIdInput.type = 'text'
			teamIdInput.addEventListener('keyup', function () {
				team.id = teamIdInput.value
				updateConfig()
			})
			teamIdElement.appendChild(teamIdInput)
			teamTableRow.appendChild(teamIdElement)

			let teamNoteElement = document.createElement('td')
			let teamNoteInput = document.createElement('input')
			teamNoteInput.type = 'text'
			teamNoteInput.addEventListener('keyup', function () {
				team.note = teamNoteInput.value ? teamNoteInput.value : undefined
				updateConfig()
			})
			teamNoteElement.appendChild(teamNoteInput)
			teamTableRow.appendChild(teamNoteElement)

			teamTableBody.appendChild(teamTableRow)
		}

		for (let i = 0; i < n; ++i) {
			let color = { name: '', id: '', team: Math.floor(i * m / n), color: '#000000' }
			colors[i] = color

			let colorTableRow = document.createElement('tr')

			let colorNumberElement = document.createElement('td')
			colorNumberElement.innerText = i
			colorTableRow.appendChild(colorNumberElement)

			let colorNameElement = document.createElement('td')
			let colorNameInput = document.createElement('input')
			colorNameInput.type = 'text'
			colorNameInput.addEventListener('keyup', function () {
				color.name = colorNameInput.value
				updateConfig()
			})
			colorNameElement.appendChild(colorNameInput)
			colorTableRow.appendChild(colorNameElement)

			let colorIdElement = document.createElement('td')
			let colorIdInput = document.createElement('input')
			colorIdInput.type = 'text'
			colorIdInput.addEventListener('keyup', function () {
				color.id = colorIdInput.value
				updateConfig()
			})
			colorIdElement.appendChild(colorIdInput)
			colorTableRow.appendChild(colorIdElement)

			let colorTeamNumberElement = document.createElement('td')
			let colorTeamNumberInput = document.createElement('input')
			colorTeamNumberInput.type = 'number'
			colorTeamNumberInput.min = 0
			colorTeamNumberInput.max = m - 1
			colorTeamNumberInput.value = color.team
			colorTeamNumberInput.addEventListener('change', function () {
				let team = parseInt(colorTeamNumberInput.value)
				if (!(team >= 0))
					team = 0
				if (!(team < m))
					team = m - 1
				color.team = team
				updateConfig()
			})
			colorTeamNumberElement.appendChild(colorTeamNumberInput)
			colorTableRow.appendChild(colorTeamNumberElement)

			let colorColorElement = document.createElement('td')
			let colorColorInput = document.createElement('input')
			colorColorInput.type = 'color'
			colorColorInput.value = color.color
			colorColorInput.addEventListener('change', function () {
				color.color = colorColorInput.value
				updateConfig()
			})
			colorColorElement.appendChild(colorColorInput)
			colorTableRow.appendChild(colorColorElement)

			let colorIsCaptainElement = document.createElement('td')
			let colorIsCaptainInput = document.createElement('input')
			colorIsCaptainInput.type = 'checkbox'
			colorIsCaptainInput.value = color.isCaptain
			colorIsCaptainInput.addEventListener('change', function () {
				color.isCaptain = colorIsCaptainInput.checked ? true : undefined
				updateConfig()
			})
			colorIsCaptainElement.appendChild(colorIsCaptainInput)
			colorTableRow.appendChild(colorIsCaptainElement)

			let colorNoteElement = document.createElement('td')
			let colorNoteInput = document.createElement('input')
			colorNoteInput.type = 'text'
			colorNoteInput.addEventListener('keyup', function () {
				color.note = colorNoteInput.value ? colorNoteInput.value : undefined
				updateConfig()
			})
			colorNoteElement.appendChild(colorNoteInput)
			colorTableRow.appendChild(colorNoteElement)

			colorTableBody.appendChild(colorTableRow)
		}

		updateConfig()

		document.getElementById('copyConfigCode').addEventListener('click', function () {
			navigator.clipboard.writeText(configCodeElement.value).then(
				function () {
					alert('复制成功！')
				},
				function () {
					alert('复制失败，请手动复制以下文本框中的代码')
				}
			)
		})
	}
}